<template>
  <!-- <view class="roder_card" @click="clickItem"> -->
  <view class="roder_card">
    <view class="item_title">{{ itemInfo.jingquName }}</view>
    <view class="item_center">
      <image :src="itemInfo.jingquPictureUrl"> </image>
      <view class="i_c_right">
        <view class="right_info" v-for="(i, index) in itemInfo.orderDetailsVos" :key="index">
          <view class="name_price">
            <text class="name2">{{ i.menpiaoCategoryName }}</text>
            <text class="price">￥{{ i.orderPrice }}</text>
          </view>
          <view class="name_price time_num">
            <text>
              <text v-if="!i.date">日期：</text>
              {{ i.date }}
            </text>
            <text>×{{ i.orderNum }}</text>
          </view>
        </view>
      </view>
    </view>
    <view class="item_bottom">
      <view class="price2">
        实付款
        <text class="price2_num">￥{{ getTotalPrice(itemInfo.orderDetailsVos) }}</text>
      </view>
      <view class="_pingjia">
        <text class="cancel_order" @click.stop="writeEvaluate(itemInfo)">填写评价</text>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  props: {
    itemInfo: {
      type: Object,
    },
  },
  data() {
    return {};
  },

  methods: {
    clickItem() {
      this.$emit('click-item', this.itemInfo.orderId)
    },

    // 去评价
    writeEvaluate(item) {
      this.$emit("write-evaluate", item);
    },


    // 计算总价格
    getTotalPrice(item) {
      if (item) {
        let totalPrice = 0;
        for (let order of item) {
          totalPrice += order.orderPrice * order.orderNum;
        }
        return totalPrice;
      } else {
        return 0;
      }
    },
  },
};
</script>

<style lang="scss">
page {
  background-color: #f5f6f7;
}

.roder_card {
  ._pingjia {
    margin-bottom: 20rpx;

    .cancel_order {
      width: 88px;
      height: 32px;
      line-height: 32px;
      border-radius: 82px;
    }

    .cancel_order {
      margin-right: 20rpx;
    }
  }
}
</style>
